
<!DOCTYPE html>
<html>
	<head>
		<title>X&#39;s Blog</title>
		<meta charset='utf-8'>
		<meta name='viewport' content='width=device-width, initial-scale=1'>
		
		<link href="static/css/bootstrap.min.css" rel='stylesheet'>
		<link rel="stylesheet" href="static/css/friendly.css">
   		<script src='http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js'></script>
		<script src="static/js/bootstrap.min.js"></script>
		<style type="text/css">
			div.read-more{
				border-left:1px solid rgb(0,0,0);
				border-right:1px solid rgb(0,0,0);
				margin:3% 35% 3% 35%;
				font-size:1.3em
			}
			div.read-more:hover{
				border-right:0px solid rgb(0,0,0);
				border-left:0px solid rgb(0,0,0);
				border-bottom:1px solid rgb(0,0,0);
				border-top:1px solid rgb(0,0,0);
			}
			span.about{color:rgb(51,122,183);}
			a.side-list-title:hover{
				background-color:rgb(200,200,200)
			}	
			a.side-list-title{
				background-color:rgb(200,200,200)
			}
			h4.side-list-item{
				margin:2px 0 0 2px
			}		
			form.tags-form{
				line-height:26px
			}		
			span.tags-span{
				margin:2px 2px 2px 2px
			}				
			input.tags-checkbox{
				display:none;
			}
			button.tags-submit{
				margin:20px 2px 2px 2px;
			}
			article{
				margin:5% 0 5% 0
			}
			p{
				font-size:1.3em;
				text-indent:2em;
				margin:0 5% 0 5%
			}
		</style>
	</head>
	<body>
		<div class='container'>
			<div class='row'>
				<header>
					<div class='logo'>
						<h1>X的博客</h1>
					</div>	
				</header>
			</div>
			<!--以上为logo-->
			<div class='row'>
				<nav class='navbar navbar-default'>
					<div class='container-fluid'>
						<div class='navbar-header'>
							<button type='button' class='navbar-toggle pull-right' data-toggle='collapse' data-target='#nav-collapse'>
								<span class='icon-bar'></span>
								<span class='icon-bar'></span>
								<span class='icon-bar'></span>
							</button>
							<div class='col-xs-6 col-sm-6 col-lg-6 navbar-left'>
								<a class=' navbar-brand' href='index.html'>MYBLOG</a>
							</div>
						</div>
						<div class='collapse navbar-collapse pull-right' id='nav-collapse'>
							<ul class='nav navbar-nav'>
								<li><a href='t.html'>HOME</a></li>
								<li><a href='untitle.html'>ABOUT</a></li>
								<li><a href='#'>CONTACT</a></li>
								<li>
									<form class='navbar-form navbar-left' method="get" action="/keyWord/" role='search'>
           								<div class='form-group'>
                							<input type='text' class='form-control' placeholder='Search'>
            							</div>
            							<button type='submit' class='btn btn-primary'>
            								<a href='#'>
          										<span class='glyphicon glyphicon-search' style='color:white'></span>
        									</a>
        								</button>
        							</form>
								</li>
							</ul>
						</div>
					</div>
				</nav>
			</div>
		</div>
		<!--以上为上部导航-->
		<div class='container'>
			<!--主体-->
			<div class='row'>
				<aside class='col-md-3'>
					<div class='list-group'>
						<a class='list-group-item side-list-title'>
							<h3 align='center' class='list-group-item-heading'>
								<span class='glyphicon glyphicon-leaf'></span>
								文章类型
							</h3>
						</a>
						
						<a href='/category/类别1' class='list-group-item'>
							<h4 align='center' class='side-list-item' >
								类别1
								<span class='glyphicon glyphicon-chevron-right'></span>
							</h4>
						</a>
						
						<a href='/category/类别2' class='list-group-item'>
							<h4 align='center' class='side-list-item' >
								类别2
								<span class='glyphicon glyphicon-chevron-right'></span>
							</h4>
						</a>
						
					</div>
					<div class='list-group'>
						<a class='list-group-item side-list-title'>
							<h3 align='center' class='list-group-item-heading'>
								<span class='glyphicon glyphicon-tags'></span>
								文章标签
							</h3>
						</a>
						<form class='list-group-item tags-form' method="get" action="/tag/" align='center'>
							<fieldset>
								
								<span class='label label-danger tags-span' onclick='chose()' id='t1'>
									<input class='tags-checkbox' type='checkbox' name='t1' id='t1-c'>标签1</input>
								</span>
								
								<span class='label label-danger tags-span' onclick='chose()' id='t2'>
									<input class='tags-checkbox' type='checkbox' name='t2' id='t2-c'>标签2</input>
								</span>
								
							</fieldset>
							<fieldset>
								<button type='submit' class='btn btn-primary tags-submit'>
            					<a href='#'  style='color:white'>
            						筛选
          							<span class='glyphicon glyphicon-search' ></span>
        						</a>
        					</button>
							</fieldset>
						</form>
					</div>
				</aside>
				<main class='col-md-9'>
					
					<article class='post post-1'>
						<header class='entry-header'>
							<h1 class='entry-title' align='center'>
								<a href='/article/1'>第一篇文章的标题</a>
							</h1>
							<div class='entry-meta' align='center'>
								<span class='post-category about'>class1</span>
			
								<span class='post-date about'><time class='entry-date'>2017年 四月25日</time></span>
			
								<span class='post-author about'>author</span>
								<span class='comments-link about'>4 Comments</span>
							</div>
						</header>
						<div class='entry-content clearfix'>
							<div style='font-size:1.3em;text-indent:2em;margin:0 5% 0 5%' >
								<h1 id="_1">一级标题</h1>
<h2 id="_2">二级标题</h2>
<h3 id="_3">三级标题</h3>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>

<p>这是一段引用</p>

<table>
<thead>
<tr>
<th>Tables</th>
<th align="center">Are</th>
<th align="right">Cool</th>
</tr>
</thead>
<tbody>
<tr>
<td>col 3 is</td>
<td align="center">right-aligned</td>
<td align="right">$1600</td>
</tr>
<tr>
<td>col 2 is</td>
<td align="center">centered</td>
<td align="right">$12</td>
</tr>
<tr>
<td>zebra stripes</td>
<td align="center">are neat</td>
<td align="right">$1</td>
</tr>
</tbody>
</table>
<blockquote>
<p>代码</p>
</blockquote>
<div class="codehilite"><pre><span></span><span class="k">def</span> <span class="nf">hello</span><span class="p">():</span>
        <span class="k">print</span> <span class="s1">&#39;hello world&#39;</span>
        <span class="n">a</span> <span class="o">=</span> <span class="mi">42</span>
        <span class="k">print</span> <span class="n">a</span>
</pre></div>
							</div>
						</div>
					</article>
					
				</main>
			</div>
		</div>
	</body>
<script>
    <!-- js监测checkbox是否被选中 -->
    function chose(){
    	var obj=event.srcElement;
    	var t=$('#'+obj.id);
    	var c=$('#'+obj.id+'-c');
    	if(!c.prop('checked')){
    		t.removeClass('label-danger');
    		t.addClass('label-success');
    		c.prop('checked',true);
    	}
    	else{

    		t.removeClass('label-success');
    		t.addClass('label-danger');
    		c.prop('checked',false);
    	}
    	
    }
    function checkbox()
    {
        var box1 = document.getElementById('checkbox1');
        var box2 = document.getElementById('checkbox2');
        var box3 = document.getElementById('checkbox3');
        var box4 = document.getElementById('checkbox4');
        if (!box1.checked) {
            alert(box1.value);
        }
        if (box2.checked) {
            alert(box2.value);
        }
        if (box3.checked) {
            alert(box3.value);
        }
        if (box4.checked) {
            alert(box4.value);
        }
        //点击确认按钮后（或者点击下一页后）让所有按钮恢复初始状态

    }
</script>
</html>
